<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>倒计时</title>
    <style>
        .yz{
            background: tan;
            width: 250px;
            height: 350px;
            text-align: center;
            margin: 50px auto;
            line-height: 50px;
        }
    </style>
</head>
<body>
    <div class="yz">
        <h2>京东秒杀</h2>
        <p>8:00点场倒计时</p>
        <h3>
            <span id="h">00</span>:
            <span id="m">00</span>:
            <span id="s">00</span>
        </h3>
    </div>

    <script>
        //设置秒杀的结束时间
        var endtime = new Date("2019-09-06 11:00:00").getTime()
        //console.log(endtime)

        var h = 0
        var m = 0
        var s = 0
        //创建一个秒杀的函数
        function seckill() {
            //获取当前的时间
            var nowtime = new Date().getTime()
            //console.log(nowtime)

            //计算出相差的秒杀
            var disparity = (endtime -nowtime) / 1000
            disparity = parseInt(disparity)
            console.log(disparity)

            //计算剩余的小时
            h = parseInt(disparity / 3600)
            m =(disparity / 60) % 60
            m = parseInt(m)
            s = disparity % 60

            //如果时、分、秒、是一位的时候，那么就在前面加上一个0
            //h-h<10 ? "0"+h:h
            if (h <10){
                h = "0"+h
            }
            if (m <10){
                m="0"+ m
            }
            if (s <10 ){
                s = "0" +s
            }
            //如果倒计时剩余的描述小于0，就停掉计时器
            if (disparity <= 0){
                clearInterval(t)
                console.log("秒杀结束")
            }
            //赋值倒计时时分秒到页面
            document.querySelector("#h").innerHTML = h
            document.querySelector("#m").innerHTML = m
            document.querySelector("#s").innerHTML =  s
        }
        //执行秒杀函数
        seckill()
        //每秒执行一次秒杀函数
        var t = setInterval(seckill, 1000)

    </script>
</body>
</html>